安裝

昨天安裝完 今天就直接來佈署環境囉 ~ ！

$ quasar init <folder name>

接下來會有介面要來引導你安裝

Project name (internal usage for dev) 
//給你確認專案名字 `注意 這邊只能小寫`

Project product name (official name) 
//填上專案的產品名稱 (這邊會寫進 package.json)

Project description 
//填上專案的敘述  (這邊會寫進 package.json)

Author
//作者 有git會自動放git的使用者帳號

Check the features needed for your project: 
//選擇要一起安裝的插件
 ◯ ESLint //用來維護程式碼品質的 好(煩人?!)東西
 ◯ Vuex   //前端倉儲
 ◯ Axios  //主要拿來接API
 ◯ Vue-i18n //多國語系
 ◯ IE11 support 
 
 
Cordova id (disregard if not building mobile apps) 
//如果有要轉Cordova可以填  沒有的話直接跳過也可以
 

選擇一起安裝的插件我基本上都會選Vuex
其他就看個人需求，這邊就裝好能省去之後自己裝還要做設定

檔案結構

這邊其實官方文件就有了 不過是英文的

我就直接搬過來講 原文

 .
├── src/
│   ├── assets/              
│   ├── statics/             
│   ├── components/          # 給你放components的
│   ├── css/                 
|   |   ├── app.styl
|   │   └── themes/          
|   │       ├── common.variables.styl # 在這邊寫的CSS能蓋掉Quasar自己元件預設的CSS
|   │       ├── variables.mat.styl    # Material 主題的變數
|   │       └── variables.ios.styl    # iOS 主題的變數
│   ├── layouts/             # 內建的layout頁面會放這裡
│   ├── pages/               # 內建的頁面也都在這
│   ├── plugins/             # 之後自己新增的插件會放這邊
│   ├── router/              # 放Vue Router的東西 這邊就不多介紹
|   |   ├── index.js         
|   │   └── routes.js        
│   ├── store/               # 放Vuex Store的東西 這邊也不多介紹
|   |   ├── index.js         
|   │   ├── <folder>         
|   │   └── <folder>         
│   ├── App.vue              # 最起始的 Vue component
│   └── index.template.html  # index.html 的模板
├── src-ssr/                 # 有使用 SSR 功能才會有這個
├── src-pwa/                 # 有使用 PWA 功能才會有這個
├── src-cordova/             # 有使用 Cordova 功能才會有這個
├── src-electron/            # 有使用 Electron 功能才會有這個
├── dist/                    # 當你 build 你的專案時會放這裡
│   ├── spa-mat/             # 資料夾名稱會依照你的<功能>跟<主題>來定義
│   ├── spa-ios/             
│   ├── electron-mat/        
│   └── ....
└── quasar.conf.js           # Quasar 的 Config 資料夾 **非常重要 大部份東西都會在這邊改**

取代 main.js 的 quasar.conf.js 設定檔

原先Vue的環境中，要增加新的插件都會到 main.js 裏面去修改
不過在Quasar中 直接被這個檔案來取代掉了
找不到的朋友們別擔心 就在這裡啦！

這邊可以設定哪些東西？

• 引用Quasar內建的元件，可以不用在每個地方瘋狂import components啦
• I18n 這邊也幫你設定好囉，直接就能用不用再翻文件去做設定
• icons 移掉註解就能用，也省去引入的時間
• 開發模式下的HTTPS及port設定
• CSS動畫 設定
• 其他外部 插件的設定 （之後會再解說）
• PWA、manifest 等設定

quasar.conf.js裡面的東西有點多，就拆到明天來講囉 XD